<template>
  <div class="personal-main">
    <div class="personal-money">
      <h3><i>资金记录</i></h3>

      <div class="personal-moneylist" style="margin-top: 40px;">
        <div class="pmain-contitle">
          <span class="pmain-title3 fb" style="width: 200px;">
            交易编号
          </span>
          <span class="pmain-title1 fb" style="width: 180px;">
            交易时间
          </span>
          <span class="pmain-title2 fb" style="width: 70px;">
            交易类型
          </span>
          <span class="pmain-title3 fb" style="width: 100px;">
            交易金额
          </span>
          <span class="pmain-title1 fb" style="width: 100px;">备注</span>
        </div>
        <ul>
          <li
            v-for="transFlow in transFlowList"
            :key="transFlow.id"
            style="width:100%"
          >
            <span class="pmain-title3 pmain-height" style="width: 200px;">
              {{ transFlow.transNo }}
            </span>
            <span class="pmain-title1 pmain-height" style="width: 180px;">
              {{ transFlow.createTime }}
            </span>
            <span class="pmain-title2 pmain-height" style="width: 70px;">
              {{ transFlow.transTypeName }}
            </span>
            <span class="pmain-title3 pmain-height" style="width: 100px;">
              {{ transFlow.transAmount }}
            </span>
            <span
              :title="transFlow.status"
              class="pmain-title1 pmain-height"
              style="width: 110px; overflow: hidden;"
            >
              <font v-if="transFlow.status === 0">未完成</font>
              <font v-else-if="transFlow.status === 1">交易完成</font>
              <font v-else>交易失败</font>
            </span>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      transFlowList: [],
    };
  },

  mounted() {
    this.fetchTransFlowList();
  },

  methods: {
    fetchTransFlowList() {
      let token = localStorage.getItem("srb-token");
      if (!token) {
        this.$message.warning("请先登录");
        return;
      }
      this.$axios({
        url: "/api/core/transFlow/auth/list",
        method: "GET",
        headers: { token },
      }).then((r) => {
        this.transFlowList = r.data.data.items;
      });
    },
  },
};
</script>
